<template>
    <div style="height: 300px;">
        <div
            style="padding-top:8px;padding-left: 10px;box-sizing: border-box;height: 40px;background-image: url('http://jsgl.zfcxjw.cq.gov.cn:6087/webcqjgNew/images/Infotitle_bg.jpg');background-size:cover;">
            监控信息</div>
        <div style="display: flex;flex-direction: row;padding:5px;font-size:13px;cursor: pointer;" v-for="item in list"
            @click="handleClick(item)">
            <div>{{ item.name }}</div>
            <div style="flex: 1;"></div>
            <el-icon>
                <VideoCamera />
            </el-icon>
            <div style="width: 50px;"></div>
        </div>
    </div>
</template>
<script setup lang="ts">
import { VideoCamera } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
// import { useRouter } from 'vue-router';
// const router = useRouter();
const list = [
    { name: "友谊东路监控1号" },
    { name: "友谊东路监控2号" },
    { name: "友谊东路监控10号" },
    { name: "友谊东路监控11号" },
    { name: "友谊西路监控1号" },
    { name: "友谊西路监控2号" },
    // { name: "友谊西路监控10号" },
    // { name: "友谊西路监控11号" },
    // { name: "仁和路西监控1号" },
    // { name: "仁和路西监控13号" },
    // { name: "仁和路西监控23号" },
];
const handleClick = (item: { name: string; }) => {
    console.log(item.name);
    ElMessage.success("暂未开放");
    // router.push({ path: '/monitor' });
}
</script>